<template>
    <div>
        <div class="one">
            <div class="one_1">
                <div><img :src="img1"/></div>
                <div>单锅意面</div>
            </div>
            <div class="one_2">
                <div><img :src="img2"/></div>
                <div>咖喱风味</div>
            </div>
        </div>
        <div class="two">
            <div class="two_1">
                <div><img :src="img3"/></div>
                <div>麻辣风味</div>
            </div>
            <div class="two_2">
                <div><img :src="img4"/></div>
                <div>千层意面</div>
            </div>
        </div>
    </div>
</template>
<script>
    export default{
        data(){
            return{
                img1:require('../img/单锅意面.jpg'),
                img2:require('../img/咖喱风味.jpg'),
                img3:require('../img/麻辣风味.jpg'),
                img4:require('../img/千层意面.jpg')
            }
        }
    }
</script>
<style scoped>
   .two_2{
    text-align: center;
}
    .two_1{
    text-align: center;
}
.two{
    display: flex;
    margin-top: 15px;
}  
.one_2{
    text-align: center;
}
.one_1{
    text-align: center;
}
 img{
    width:120px;height:120px;
    margin-left: 15px;
}
.one{
    display: flex;
    margin-top: 15px;
}  
</style>